<template>
    <div class="app-container" v-loading="loading">
      <!-- 添加或修改菜谱对话框 -->
      <el-form
        ref="form"
        :model="form"
        :rules="rules"
        label-width="80px"
        class="el-form"
      >
        <div class="disp-from-flxe">
          <el-form-item label="学校" prop="schoolId">
            <!-- <el-select v-model="form.schoolId" filterable>
              <el-option
                v-for="(item, index) in schoolArr"
                :key="index"
                :label="item.nickName"
                :value="item.userId"
              ></el-option>
            </el-select> -->
          </el-form-item>
          <el-form-item label="供应商" prop="userId">
            <!-- <el-select v-model="form.userId" filterable>
              <el-option
                v-for="(item, index) in entArr"
                :key="index"
                :label="item.nickName"
                :value="item.userId"
              ></el-option>
            </el-select> -->
          </el-form-item>
        </div>
  
        <div class="disp-from-flxe">
          <el-form-item label="配送时间" prop="sendTime">
            <!-- <el-date-picker
              v-model="form.sendTime"
              type="date"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
            >
            </el-date-picker> -->
          </el-form-item>
          <el-form-item label="采购金额" prop="money">
            <!-- <el-input-number
              v-model="form.money"
              :min="0"
              :precision="2"
              @change="cheNumMoney"
            ></el-input-number> -->
          </el-form-item>
        </div>
  
        <div class="disp-from-flxe">
          <el-form-item label="材料清单">
            <el-table border :data="form.params.details">
              <!-- <el-table-column type="selection" width="55" align="center" /> -->
              <el-table-column
                label="序号"
                align="center"
                type="index"
                width="50"
              />
  
              <el-table-column label="商品" align="center" width="200">
                <template slot-scope="scope">
                  
                </template>
              </el-table-column>
              <el-table-column label="规格" align="center" width="200">
                <template slot-scope="scope">
                  
                </template>
              </el-table-column>
              <el-table-column label="单位" align="center" width="200">
                <template slot-scope="scope">
                  
                </template>
              </el-table-column>
  
              <el-table-column label="数量" align="center" width="200">
                <template slot-scope="scope">
                 
                </template>
              </el-table-column>
  
              <el-table-column label="实收数量" align="center" width="200">
                <template slot-scope="scope">
                  
                </template>
              </el-table-column>
              <el-table-column label="实际数量" align="center" width="200">
                <template slot-scope="scope">
                  
                </template>
              </el-table-column>
            </el-table>
          </el-form-item>
        </div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">取 消</el-button>
        <el-button type="primary" @click="submitForm">确 定</el-button>
      </div>
    </div>
  </template>
      
      <script>
  import { listUser } from "@/api/system/user";
  import { listDept } from "@/api/system/dept";
  import { getDeliveryInfo, addDelivery, editDelivery } from "@/api/system/procure";
  import { getFormaType } from "@/api/system/type";
  
  import { getFormatbrandData } from "@/api/system/brand";
  // import { getFormatCateData } from "@/api/system/cate";
  import { getFormatSpecData } from "@/api/system/specifications";
  export default {
    name: "addMenu",
    props: {
      mId: {
        type: String,
        default: 0,
      },
    },
    data() {
      return {
        loading: true,
        typeArr: [], //类型
        brandArr: [], //单位
        specArr: [], //规格
        schoolArr: [], //学校
        entArr: [], //供应商
        caseArrs: [
          { val: 0, lab: "小学" },
          { val: 1, lab: "初中" },
        ],
        // 表单参数
        form: {
          id: undefined,
          schoolId: undefined,
          userId: undefined,
          sendTime: undefined,
          money: 0,
          params: {
            details: [
              // {
              //   typeId: undefined, //分类id
              //   specId: undefined, //规格id
              //   brandId: undefined, //单位id
              //   price: undefined, //单价
              //   num: undefined, //数量
              //   money: 0, //总价
              //   id: undefined,
              // },
            ],
          },
        },
        // 表单校验
        rules: {
          name: [{ required: true, message: "名称不能为空", trigger: "blur" }],
          cate: [
            {
              required: true,
              message: "请选择类型",
              trigger: ["blur", "change"],
            },
          ],
          // param
        },
      };
    },
    created() {
      this.show();
      console.log(this.mId)
      console.log('this.mId')
      // console.log(this.mId)
    },
    methods: {
      cheNumMoney(e) {
        if (e == undefined) {
          e = 0.0;
          this.form.money = 0.0;
          // console.log(this.form.money)
          this.$forceUpdate();
          // form.money
        }
      },
      chType(e, scope) {
        console.log(e);
        console.log(scope);
      },
      cheNum(e, scope) {
        if (e == undefined) {
          scope.row.num = 0;
        }
      },
      show() {
        //供应商
        listUser({ pageNum: -1, pageSize: -1, deptId: 1000002 }).then(
          (response) => {
            this.entArr = response.rows;
          }
        );
        //学校
        listDept({ pageNum: -1, pageSize: -1, type: 1, parentId: 1000003 }).then(
          (response) => {
            this.schoolArr = response.rows;
          }
        );
  
        //单位
        getFormatbrandData({ pageNum: -1, pageSize: -1 }).then((response) => {
          this.brandArr = response.rows;
        });
  
        //规格
        getFormatSpecData({ pageNum: -1, pageSize: -1 }).then((response) => {
          this.specArr = response.rows;
          // console.log(this.getFormatSpecData);
        });
  
        //类型
        getFormaType({ pageNum: -1, pageSize: -1 }).then((response) => {
          // this
          this.typeArr = response.rows;
          this.loading = false;
          if (this.mId == 0) {
            console.log(this.typeArr[0]);
            console.log(this.typeArr[0].specId);
            console.log(this.typeArr[0].brandId);
            this.form.params.details.push({
              typeId: this.typeArr[0].id, //分类id
              specId: this.typeArr[0].specId, //规格id
              brandId: this.typeArr[0].brandId, //单位id
              price: 0, //单价
              num: 0, //采购数量
              money: 0, //总价
              remark: undefined, //备注
              jMoney: 0, //收货均价
              shouNum: 0, //已收数量
              weiNum: 0, //未收货数量
              id: undefined,
            });
            //   this.form.params.details[0].typeId = this.typeArr[0].id;
            //   this.form.params.details[0].brandId = this.brandArr[0].id;
            //   this.form.params.details[0].specId = this.specArr[0].id;
          }
        });
        if (this.mId != 0) {
          getDeliveryInfo(this.mId).then((response) => {
            var res = response.data;
            this.form = {
              id: res.id,
              schoolId: res.schoolId,
              userId: res.userId,
              sendTime: res.sendTime,
              money: res.money,
              params: {
                details: res.details,
              },
            };
          });
        }
      },
      delParams(scope) {
        //   console.log(scope);
        this.form.params.details.splice(scope.$index, 1);
      },
      addParams(scope) {
        this.form.params.details.push({
          typeId: this.typeArr[0].id, //分类id
          specId: this.typeArr[0].specId, //规格id
          brandId: this.typeArr[0].brandId, //单位id
          price: 0, //单价
          num: 0, //采购数量
          money: 0, //总价
          remark: undefined, //备注
          jMoney: 0, //收货均价
          shouNum: 0, //已收数量
          weiNum: 0, //未收货数量
          id: undefined,
        });
        //   console.log(scope);
      },
      cancel() {
        this.$emit("cancel");
      },
      /** 提交按钮 */
      submitForm: function () {
        //   try {
        //     arr.forEach(function (value, index, array) {
        //       this.params.details.forEach((e, i) => {
        //         if (i == 1) {
        //           // break;
        //         }
        //       });
        //     });
        //   } catch (e) {
        //     if (e.message !== "Stop Iteration") throw e; // 只捕获我们的异常，其他异常继续抛出
        //   }
        this.$refs["form"].validate((valid) => {
          if (valid) {
            //   return;
            console.log("111");
            if (this.form.id != undefined) {
              console.log("222");
              editDelivery(this.form).then((response) => {
                this.$modal.msgSuccess("修改成功");
                this.$emit("submitForm");
              });
            } else {
              console.log("333");
              addDelivery(this.form).then((response) => {
                this.$modal.msgSuccess("新增成功");
                this.$emit("submitForm");
              });
            }
          }
        });
      },
    },
  };
  </script>
      